<template>
	<view class="deduction-config-layout">
		<uv-navbar title="配置扣款规则" :titleStyle="{fontSize:'18px'}" :placeholder="true" autoBack>
			<template #right>
				<text style="color: #5F56EF;" v-if="navRightButtonText != ''" @tap="edit">{{navRightButtonText}}</text>
			</template>
		</uv-navbar>
		<view class="deduction-config-header">货款信息</view>
		<view class="deduction-config-item">
			<text>当前货款总额</text>
			<text>¥{{dataInfo.billUnpayAmount}}</text>
			<view class="line"></view>
		</view>
		<view class="deduction-config-item">
			<text>上月总收益</text>
			<text>¥{{dataInfo.lastMonthIncomeAmt}}</text>
		</view>
		<view class="deduction-config-header">扣款信息</view>
		<view class="deduction-config-item">
			<text>每月扣款金额</text>
			<xh-input placeholder="请输入" inputTextAlign="right" :isLine="false" height="40rpx" padding="0" :isSelect="!isOpenEdit" :showRightIcon="false" v-model="dataInfo.inputValue"></xh-input>
			<view class="line"></view>
		</view>
		<view class="deduction-config-item" @tap="showSelectDate">
			<text>选择生效日期</text>
			<xh-input placeholder="请选择" inputTextAlign="right" :isLine="false" height="40rpx" padding="0" isSelect v-model="dataInfo.validTime_text" :showRightIcon="isOpenEdit"></xh-input>
		</view>
		<view class="deduction-config-header">扣款比例</view>
		<view class="deduction-config-list">
			<view class="deduction-config-item" v-for="(item,index) in dataInfo.incomeRates" :key="index">
				<view class="deduction-config-item-left">
					<text>{{item.incomeName}}</text>
					<text>上月占比{{item.incomeName}}</text>
				</view>
				<xh-input placeholder="请输入" inputTextAlign="right" :isLine="false" height="40rpx" padding="0" :isSelect="!isOpenEdit" :showRightIcon="false" v-model="item.inputValue"></xh-input>
				<view class="line"></view>
			</view>
		</view>
		<view class="submit-btn" style="margin-top: 50rpx;" v-if="isOpenEdit" @tap="save">确认提交</view>
		<uv-picker ref="picker" :columns="columns" keyName="name" @confirm="confirm"></uv-picker>
	</view>
</template>

<script setup>
	import { onLoad } from '@dcloudio/uni-app'
	import { ref } from 'vue'
	import { getBillDeductRule,updateBillDeductRule } from '@/common/api/api.js'
	const props = defineProps(['agentId'])
	const columns = ref([[{name:'当月生效',type:'1'},{name:'次月生效',type:'2'}]])
	const picker = ref(null)
	const isOpenEdit = ref(false)
	const navRightButtonText = ref('')
	const dataInfo = ref({
		billDeductAmount:'0',
		billUnpayAmount:'0',
		lastMonthIncomeAmt:'0',
		validTime_text:'',
		validTime:'',
		// 当前输入的每月扣款金额
		inputValue:'',
		incomeRates:[]
	})
	//配置/取消配置
	const edit = ()=>{
		if(navRightButtonText.value == '配置'){
			navRightButtonText.value = '取消'
			isOpenEdit.value = true
		}
		else{
			navRightButtonText.value = '配置'
			isOpenEdit.value = false
		}
	}
	//选择生效日期
	const showSelectDate = ()=>{
		if(!isOpenEdit.value){
			return
		}
		picker.value.open()
	}
	// 选择生效日期回调
	const confirm = (res)=>{
		dataInfo.value.validTime_text = res.value[0].name
		dataInfo.value.validTime = res.value[0].type
	}
	// 获取抵扣规则数据
	const getBillDeductRuleData = async ()=>{
		const res = await getBillDeductRule({agentId:props.agentId})
		const data = res.result
		dataInfo.value = data
		dataInfo.value.inputValue = `${dataInfo.value.billDeductAmount}`
		if(dataInfo.value.validTime == '1'){
			dataInfo.value.validTime_text = '当月生效'
		}
		else if(dataInfo.value.validTime == '2'){
			dataInfo.value.validTime_text = '次月生效'
		}
		else{
			dataInfo.value.validTime_text = ''
		}
		dataInfo.value.incomeRates.forEach(item=>{
			item.inputValue = `${item.incomeRate}`
		})
		if(uni.$uv.test.empty(dataInfo.value.validTime)){
			isOpenEdit.value = true
			navRightButtonText.value = ''
		}
		else{
			navRightButtonText.value = '配置'
			isOpenEdit.value = false
		}
		console.log(dataInfo.value)
	}
	// 保存配置
	const save = async ()=>{
		if(uni.$uv.test.empty(dataInfo.value.validTime)){
			uni.$utils.showToast('请选择生效日期')
			return
		}
		if(uni.$uv.test.empty(dataInfo.value.inputValue)){
			uni.$utils.showToast('请输入每月扣款金额')
			return
		}
		let params = {}
		params.agentId = props.agentId
		params.validTime = dataInfo.value.validTime
		params.billDeductAmount = uni.$uv.trim(dataInfo.value.inputValue,'all')
		let datas = []
		dataInfo.value.incomeRates.forEach(item=>{
			let incomeRate = uni.$uv.trim(item.inputValue,'all')
			let obj = {}
			obj.profitTypeCode = item.profitTypeCode
			if(uni.$uv.test.empty(incomeRate)){
				obj.incomeRate = '0'
			}
			else{
				obj.incomeRate = incomeRate
			}
			datas.push(obj)
		})
		params.incomeRates = datas
		await updateBillDeductRule(params)
		uni.$utils.showToast('配置扣款规则成功',1000,()=>{
			getBillDeductRuleData()
		})
	}
	onLoad(()=>{
		getBillDeductRuleData()
	})
	
</script>

<style lang="scss" scoped>
.deduction-config-layout{
	padding-bottom: 100rpx;
	.deduction-config-header{
		padding: 30rpx;
	}
	.deduction-config-item{
		background-color: #fff;
		padding: 30rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
		.deduction-config-item-left{
			display: flex;
			flex-direction: column;
			text:nth-child(2){
				color: $xh-color-9;
				font-size: 24rpx;
				margin-top: 10rpx;
			}
		}
	}
}
</style>
